<template>
  <m-header-title headerTitle="errorVue" @goBack="goBack" />
  <div class="error-div">
    <img src="./../assets/images/404_cloud.png" alt="" />
    <img src="./../assets/images/404.png" alt="" />
  </div>
</template>

<script lang="ts">
import { toRefs, defineComponent, reactive } from 'vue'

import { MHeaderTitle } from '@/components'

import { useRouter } from 'vue-router'

export default defineComponent({
  nem: 'ErrorVue',
  components: {
    MHeaderTitle,
  },
  setup: () => {
    const router = useRouter()
    const data = reactive({})
    const goBack = () => {
      router.replace(`/Home`)
    }
    return { ...toRefs(data), goBack }
  },
})
</script>

<style scoped lang="scss">
.error-div {
  padding-top: 120px;
  img {
    display: block;
    width: 80%;
    margin: 0 auto;
  }
}
</style>
